<template>
	<view class="search">
		<view class="sugg-item" v-for="(item,i) in searchResults" :key="i">
			<view class="search-user" v-if="item.types == '1'">
				<view class="search-top" v-if="item.title !== ''">
					<text>{{item.title}}</text>
				</view>
				<view class="search-box">
					<view class="sugg-item-left" @click="gotoDetail(item)">
						<image :src="item.head == null ? defaultImg:item.head"></image>
					</view>
					<view class="sugg-item-center" @click="gotoDetail(item)">
						<text>
							{{item.nickname}}
						</text>
					</view>
					<view class="sugg-item-right">
						<view class="button-top" @click="sendMsg(item)" v-if="item.state != '0'">
							<text>发消息</text>
						</view>
						<view class="button-bottom" v-else @click="addFriend(item)">加好友</view>
					</view>
				</view>
			</view>

			<view class="search-user" v-if="item.types == '2'">
				<view class="search-top" v-if="item.title !== ''">
					<text>{{item.title}}</text>
				</view>
				<view class="search-box">
					<view class="sugg-item-left">
						<image :src="item.head == null ? defaultImg:item.head"></image>
					</view>
					<view class="sugg-item-center">
						<text>
							{{item.nickname}}
						</text>
					</view>
					<view class="sugg-item-right">
						<view class="button-top" @click="sendMsgByGroup(item)">发消息</view>
					</view>
				</view>
			</view>

		</view>
	</view>
</template>

<script>
	export default {
		props: ['searchResults'],
		data() {
			return {
				searchData: []
			}
		},
		methods: {
			//发送消息
			sendMsg(item) {
				//跳转到聊天界面
				var req = {
					id: item.userId,
					nickname: item.nickname,
					head: item.head,
					type: 2 //用户单聊类型
				}
				//console.log(123)
				uni.navigateTo({
					url: '/pages/newMsg/chat-user/chat-user?msgObject=' + JSON.stringify(req)
				})
			},
			//添加好友
			addFriend(item) {
				var reqData = {
					type: 9,
					msg: {
						sendId: uni.getStorageSync('userId'),
						sendName: uni.getStorageSync('nickname'),
						sendHead: uni.getStorageSync('head'),
						receiveId: item.userId,
						message: '添加好友',
						sysType: 2,
					}
				}

				uni.myWebsocket.socketTask.send({
					data: JSON.stringify(reqData),
					async success() {
						return uni.$showMsg('发送成功');
					},
					fail(e) {
						uni.$showMsg('发送失败！');
					}
				});
			},
			//3，跳转用户详情页面
			gotoDetail(item) {
				var req = {
					id: item.userId,
					nickname: item.nickname,
					head: item.head,
					type: 2 //用户单聊类型
				}

				uni.navigateTo({
					url: '/subpkg/msg/user/user-describe/user-describe?msgObject=' + JSON.stringify(req),
				})
			},
			//4，群聊发消息
			sendMsgByGroup(item) {
				//跳转到聊天界面
				var req = {
					id: item.userId,
					nickname: item.nickname,
					head: item.head,
					type: 3 //用户单聊类型
				}
				//console.log(123)
				uni.navigateTo({
					url: '/pages/newMsg/chat-group/chat-group?msgObject=' + JSON.stringify(req)
				})
			}
		},

	}
</script>

<style scoped lang="scss">
	.search-user {
		width: 90%;
		margin-left: 5%;

		.search-top {
			text {
				font-size: 40rpx;
				font-weight: 600;
			}
		}

		.search-box {
			display: flex;
			height: 150rpx;

			.sugg-item-left {
				width: 25%;

				image {
					margin-top: 15rpx;
					width: 120rpx;
					height: 120rpx;
					border-radius: 50%;
				}
			}

			.sugg-item-center {
				line-height: 150rpx;
				width: 55%;
				font-size: 32rpx;
			}

			.sugg-item-right {
				width: 20%;

				.button-top {
					width: 130rpx;
					height: 60rpx;
					border-radius: 30rpx;
					background-color: #FFE02D;
					color: black;
					margin-top: 45rpx;
					font-size: 30rpx;
					text-align: center;
					line-height: 60rpx;


					/* #8FBDEB
					#EDF5FF
					#FFE02D */
				}

				.button-bottom {
					width: 130rpx;
					height: 60rpx;
					border-radius: 30rpx;
					background-color: #8FBDEB;
					color: #EDF5FF;
					margin-top: 45rpx;
					font-size: 30rpx;
					text-align: center;
					line-height: 60rpx;
				}

			}
		}
	}
</style>